<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/taglibs.jsp"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
	request.setAttribute("basePath", basePath);
%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>后台服务概览</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Access-Control-Allow-Origin" content="*">

<!-- css -->
<link href="${ctx}/css/skin/bootstrap-cerulean.css" rel="stylesheet"
	id="bs-css">

<link href="${ctx}/css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="${ctx}/css/bootstrap-sortable.css" rel="stylesheet">
<link href="${ctx}/css/dynamic-page.css" rel="stylesheet">

<!-- external javascript
	================================================== -->
<!-- Placed at the end of the document so the pages load faster -->

<script src="${ctx}/js/jquery.min.js"></script>
<!-- 在dynamic-page.js中, 用到了jquery-ui的sortable拖曳特效 -->
<script src="${ctx}/js/jquery-ui.custom.min.js"></script>
<script src="${ctx}/js/bootstrap.min.js"></script>
<script src="${ctx}/js/dynamic-page.js"></script>
<script src="${ctx}/js/bootstrap-tooltip.js"></script>
<script src="${ctx}/js/bootstrap-popover.js"></script>

<script src="${ctx}/js/bootstrap-sortable.js"></script>

<style type="text/css">
.div-space {
	margin-left: 15px;
	margin-right: 15px;
}
</style>

</head>

<body>
	<div class="row-fluid sortable">
		<!-- 切换皮肤需求引用 -->
		<input type="hidden" id="ctx" value="">
		<div class="box-content">
			<div class="box rp-table">
				<div class="box-header well">
					<h2>
						<i class="icon-info-sign"></i> <span id='tTitle'>后台服务信息</span>
					</h2>
					<div class="box-icon">
						<a href="#" class="btn btn-close btn-round"><i
							class="icon-remove"></i></a>
					</div>
				</div>
				<div class="box-content">
					<table id="confTable"
						class="table table-striped table-bordered table-hover table-condensed  scrolltable sortable">
						<thead>
							<tr>
								<th>服务组</th>
								<th>分区</th>
								<th>实例容器大小</th>
								<th>实际元素个数</th>
								<th>创建时间</th>
							</tr>
						</thead>
						<tbody>
							<c:forEach items="${ocgList}" var="ocg" varStatus="index">
								<tr>
									<td>${ocg.computingGroup}</td>
									<td>${ocg.partition}</td>
									<td>${ocg.bitsetSize}</td>
									<td>${ocg.elementNum}</td>
									<td>${ocg.createTime}</td>
								</tr>
							</c:forEach>
						</tbody>
					</table>
				</div>
			</div>
		</div>

		<div class="box-content">
			<div class="box rp-table">
				<div class="box-header well">
					<h2>
						<i class=" icon-question-sign"></i> <span id='tTitle'>帮助</span>
					</h2>
					<div class="box-icon">
						<a href="#" class="btn btn-close btn-round"><i
							class="icon-remove"></i></a>
					</div>
				</div>
				<div class="box-content">
					<span>组代号：表示服务所属组，此代号必须唯一</span>
					<p>
					<span>分区：表示该组的分区</span>
					<p>
					<span>元素个数：表示该组的分区中的实际元素个数</span>
					<p>
				</div>
			</div>
		</div>
	</div>
</body>
</html>
